{% extends "../base_adminlte.html" %}
{% load staticfiles %}
{% load widget_tweaks  %}
{% block content %}
<div class="content-wrapper">
  <!-- Content Header (Page header) -->
    <div class="content-header">
    </div>

  <section class="content">
  <form action="" role="search" method="get">
    <div class="input-group col-md-12">
        {% with form=filter.form %}
                {% for field in form.visible_fields %}
        <div class="form-group col-sm-4 col-md-4">
        {{ field.label_tag }}
                      {% render_field field  %}
        </div>
        {% endfor %}
        {% endwith %}
    </div>
                <button    type="submit" class="btn btn-primary" id="btn_add" data-toggle="modal"
                     data-target="#addModal" >查询</button>
             {% if perms.public.host_manage %}
              <button  type="button" class="btn btn-primary" id="btn_export" data-toggle="modal"
                     data-target="#addModal" onclick="location='{% url 'hostinfoexport' %}?{% param_replace page=1 %}'">导出</button>
          {% endif %}
{#          </label>#}
      </form>
          <table class="table table-bordered">
            <tr style="font-weight: bold;background-color: #3c8dbc80;">
                <td align="center" style="white-space:nowrap;">systemname</td>
                <td align="center" style="white-space:nowrap;">sship</td>
                <td align="center" style="white-space:nowrap;">hostname</td>
                <td align="center" style="white-space:nowrap;">ipaddrs</td>
                <td align="center" style="white-space:nowrap;">kernel</td>
                <td align="center" style="white-space:nowrap;">osrelease</td>
                <td align="center" style="white-space:nowrap;">productname</td>
                <td align="center" style="white-space:nowrap;">processorname</td>
                <td align="center" style="white-space:nowrap;">cpunum</td>
                <td align="center" style="white-space:nowrap;">cpurate</td>
                <td align="center" style="white-space:nowrap;">memtotal</td>
                <td align="center" style="white-space:nowrap;">memrate</td>
                <td align="center" style="white-space:nowrap;">fileUsage</td>
            </tr>
          {% for h in page_obj %}
              <tr style="background-color: #e4e6e8">
                  <td style="white-space:nowrap;vertical-align:middle;">{{ h.systemname }}</td>
                  <td style="white-space:nowrap;vertical-align:middle;">{{ h.sship }}</td>
                  <td style="white-space:nowrap;vertical-align:middle;">{{ h.hostname }}</td>
                  <td style="vertical-align:middle;"><p style="word-break:break-all;width:150px">{{ h.ipaddrs }}</p></td>
                  <td style="white-space:nowrap;vertical-align:middle;">{{ h.kernel }}</td>
                  <td style="vertical-align:middle;"><p style="word-break:break-all;width:150px">{{ h.osrelease }}</p></td>
                  <td style="white-space:nowrap;vertical-align:middle;">{{ h.productname }}</td>
                  <td style="vertical-align:middle;"><p style="word-break:break-all;width:150px">{{ h.processorname }}</p></td>
                  <td style="white-space:nowrap;vertical-align:middle;">{{ h.cpunum }}</td>
                  <td style="white-space:nowrap;vertical-align:middle;">{{ h.cpurate }}</td>
                  <td style="white-space:nowrap;vertical-align:middle;">{{ h.memtotal }}</td>
                  <td style="white-space:nowrap;vertical-align:middle;">{{ h.memrate }}</td>
                  <td style="vertical-align:middle;"><p style="word-break:break-all;width:250px">{{ h.fileUsage }}</p></td>
              </tr>
          {% endfor %}
          </table>
      <div  style="float:right;height: 200px;font-size:15px">
                     {#  #总条数#}
                <div  style="width: 100px;height: 50px;float:left;margin: 10px 0 0 1px">总记录<label>{{ filter.qs|length }}</label>条</div>
                    {#  #总页码#}
                <div  style="width: 60px;height: 50px;float:left;margin: 10px 0 0 1px">共<label>{{ total }}</label>页</div>
                    {# #首页#}

                   <div  style="width: 30px;height: 50px;float:left;margin: 10px 0 0 1px">
                            <p><a href="?{% param_replace page=1 %}">首页</a></p>
                   </div>
                    {# #前一页#}
                    <div style="width: 30px;height: 50px;float:left;margin: 10px 0 0 5px">
                       {% if page_obj.has_previous %}
                         <p><a href="?{% param_replace page=page_obj.previous_page_number %}">{{ page_obj.previous_page_number }}</a> </p>
                        {% endif %}
                   </div>
                    {##当前页页码#}
                   <div  style="width: 30px;height: 50px;float:left;margin: 10px 0 0 1px">
                       <p> {{ page_obj.number }}</p>

                   </div>
                    {# #后一页#}
                   <div style="width: 30px;height: 50px;float:left;margin: 10px 0 0 1px">
                   {% if page_obj.has_next %}
                       <p><a href="?{% param_replace page=page_obj.next_page_number %}">{{ page_obj.next_page_number }}</a></p>
                    {% endif %}
                   </div>
                    {##尾页#}
                     <div  style="width: 30px;height: 50px;float:left;margin: 10px 0 0 1px">
                            <p><a href="?{% param_replace page=total %}">尾页</a> </p>
                   </div>
        </div>
  </section>
</div>

{% endblock %}